<script>
  import apis from "../../apis/index";

  const graph = apis.getModuleApis("graph");
  
  export default{
    data(){
        return {
            list:[]
        }
    },
    mounted(){
        graph.getProjectList().then(res=>{
            this.list = res.data.data
        })
    }
  }


</script>

<template>
<div class="home">
    <div class="project-item" v-for="item in list" :key="item.id" >
        <el-image
              style="width: 64px; height: 64px; margin-left: 10px"
              :src="item.thumbUrl"
              fit="scale-down"
            />
        <div class="item-text"> <router-link :to="'/editor?id='+item.id" >{{item.name}}</router-link></div>
    </div>
</div>
</template>

<style lang="scss">
.home{
    width:100%;
    height: 100%;
    overflow: hidden;
    overflow-y: auto;
}

.project-item{
    display: flex;
    padding: 20px;
    align-items: center;
    width: 220px;
    .item-text{
        color: #fff;
        margin-left: 10px;
    }
}
a{
    color: #fff;
    text-decoration: none;
}
</style>
